<template>
  <div class="appPage">
    <h3 class="tit">
      企业申请
      <el-button
        type="warning"
        class="add"
        @click="apply()"
        style="float: right"
        >企业申请<i class="el-icon-upload el-icon--right"></i
      ></el-button>
    </h3>
    <div class="search">
      <div class="left">
        <span>代理编号</span>
        <el-input
          v-model="form.userId"
          placeholder="请输入代理编号"
          class="handle-input mr10"
          v-on:keyup.enter="handleSearch"
        ></el-input>
        <span>企业名称</span>
        <el-input
          v-model="form.companyName"
          placeholder="请输入企业名称"
          class="handle-input mr10"
          v-on:keyup.enter="handleSearch"
        ></el-input>
        <span>状态</span>
        <el-select
          v-model="value"
          placeholder="请选择状态"
          style="width: 400px"
        >
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </div>
      <div class="right">
        <el-button
          type="primary"
          icon="el-icon-search"
          @click="handleSearch"
          class="searchBtn"
          >查找</el-button
        >
        <el-button
          class="reset"
          type="primary"
          icon="el-icon-refresh"
          @click="reset()"
          >重置</el-button
        >
      </div>
    </div>

    <div class="container">
      <el-table
        :data="tableData"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
        @selection-change="handleSelectionChange"
      >
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="userId"
          label="代理编号"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="companyName"
          label="企业名称"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="createTime"
          label="创建时间"
          align="center"
        ></el-table-column>
        <el-table-column prop="status" label="状态" align="center">
          <template #default="scope">
            <span v-if="scope.row.status == 0">未提交</span>
            <span v-if="scope.row.status == 1">待审核</span>
            <span v-if="scope.row.status == 2">未通过</span>
            <span v-if="scope.row.status == 3">已通过</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="remark"
          label="备注"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" width="300" align="center">
          <template #default="scope">
            <el-button
              type="primary"
              @click="handleClick(scope)"
              v-if="scope.row.status != 3"
              >补充资料</el-button
            >
            <el-button type="primary" @click="details(scope)">详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    <!--下面这段代码有问题  -->
     <div class="pagination">
        <el-pagination
          background
          layout="total, prev, pager, next"
          :current-page="pageIndex"
          :page-size="pageSize"
          :total="pageTotal"
          @current-change="handlePageChange"
        ></el-pagination>
      </div>

    </div>

    
    <!-- 企业申请弹出框 -->
    <el-dialog title="企业申请" v-model="applyShow" width="60%" >
      <el-form
        ref="dataAddForm"
        :model="forms"
        :rules="addRules"
        label-width="130px">
        <!-- <el-form-item label="代理编号" prop="userId">
          <el-input v-model="forms.userId" placeholder="请输入代理编号"></el-input>
        </el-form-item> -->
        <el-form-item label="企业名称" prop="companyName">
          <el-input
            v-model="forms.companyName"
            placeholder="请输入企业名称"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人姓名" prop="legalName">
          <el-input
            v-model="forms.legalName"
            placeholder="请输入法人姓名"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人身份证号" prop="legalCard">
          <el-input
            v-model="forms.legalCard"
            placeholder="请输入法人身份证号"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人电话号" prop="legalPhone">
          <el-input
            v-model="forms.legalPhone"
            placeholder="请输入法人电话号"
          ></el-input>
        </el-form-item>
        <el-form-item label="营业执照号" prop="businessNumber">
          <el-input
            v-model="forms.businessNumber"
            placeholder="请输入营业执照号"
          ></el-input>
        </el-form-item>
        <el-form-item label="话术" prop="talk">
          <el-input
            v-model="forms.talk"
            type="textarea"
            maxlength="500"
            placeholder="请输入话术，字数限制:500字"
          ></el-input>
        </el-form-item>
        <el-form-item label="报备通道（线路）" prop="channel">
          <el-input v-model="forms.channel" maxlength="500"></el-input>
        </el-form-item>
      </el-form>

      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >营业执照复印件（只可上传一张）(盖公章)</span
      >
      <div style="display: flex; justify-content: center">
        <el-upload
          style="margin: 20px"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible">
          <img width="100%" :src="dialogImageUrl" alt="" />
        </el-dialog>
      </div>
      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px">
        法人身份证复印件(盖公章)
        <h5 style="margin-left: 115px">
          联通1,移动4需要添加手持身份证照片（正反面）(法人无法提供就提供经办人的手持身份证照片)
        </h5>

        <h5 style="margin-left: 115px">电信额外材料请联系客服</h5>
      </span>
      <div style="display: flex; justify-content: center">
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          :headers="myHeaders"
          limit="1"
          list-type="picture-card"
          :on-success="handleSuccess1"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl1" alt="" />
          </el-dialog>
        </el-upload>
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          :headers="myHeaders"
          list-type="picture-card"
          limit="1"
          :on-success="handleSuccess4"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl4" alt="" />
          </el-dialog>
        </el-upload>
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          :headers="myHeaders"
          limit="1"
          list-type="picture-card"
          :on-success="handleSuccess6"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl6" alt="" />
          </el-dialog>
        </el-upload>
      </div>
      <span style="font-weight: bold; font-size: 18px; color: red"></span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >经办人身份证复印件（盖公章）/经办人手持身份证照片</span
      >
      <div style="display: flex; justify-content: center">
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          list-type="picture-card"
          limit="1"
          :headers="myHeaders"
          :on-success="handleSuccess2"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl2" alt="" />
          </el-dialog>
        </el-upload>
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          :headers="myHeaders"
          list-type="picture-card"
          limit="1"
          :on-success="handleSuccess5"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl5" alt="" />
          </el-dialog>
        </el-upload>
        <el-upload
          style="margin: 20px"
          :action="doUpload"
          :headers="myHeaders"
          list-type="picture-card"
          limit="1"
          :on-success="handleSuccess7"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
          <el-dialog v-model="dialogVisible">
            <img width="100%" :src="dialogImageUrl7" alt="" />
          </el-dialog>
        </el-upload>
      </div>
      <span style="font-weight: bold; font-size: 18px; color: red;">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px;">公司报备话术模板证复印件（只可上传一张）(盖公章)</span>
      <div style="display:flex;justify-content: center;">
      <el-upload
        style="margin:20px"
        :action="doUpload"
        :headers="myHeaders"
        list-type="picture-card"
        limit="1"
        :on-success="handleSuccess3"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove">
        <i class="el-icon-plus"></i>
        <el-dialog v-model="dialogVisible">
          <img width="100%" :src="dialogImageUrl3" alt="">
        </el-dialog>
      </el-upload>
      <el-upload
        style="margin:20px"
        :action="doUpload"
        :headers="myHeaders"
        list-type="picture-card"
        limit="1"
        :on-success="handleSuccess8"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove">
        <i class="el-icon-plus"></i>
        <el-dialog v-model="dialogVisible">
          <img width="100%" :src="dialogImageUrl8" alt="">
        </el-dialog>
      </el-upload>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="applyShow = false">取 消</el-button>
          <el-button type="primary" @click="applySubmit('draft')"
            >暂 存</el-button
          >
          <el-button type="primary" @click="applySubmit('add')"
            >确 定</el-button
          >
        </span>
      </template>
    </el-dialog>

    <!-- 补充资料弹出框 -->
    <el-dialog title="补充资料" v-model="editShow" width="60%">
      <el-form
        ref="dataAddForm"
        :model="forms"
        :rules="addRules"
        label-width="130px">
        <el-form-item label="企业名称" prop="companyName">
          <el-input
            v-model="forms.companyName"
            placeholder="请输入企业名称"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人姓名" prop="legalName">
          <el-input
            v-model="forms.legalName"
            placeholder="请输入法人姓名"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人身份证号" prop="legalCard">
          <el-input
            v-model="forms.legalCard"
            placeholder="请输入法人身份证号"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人电话号" prop="legalPhone">
          <el-input
            v-model="forms.legalPhone"
            placeholder="请输入法人电话号"
          ></el-input>
        </el-form-item>
        <el-form-item label="营业执照号" prop="businessNumber">
          <el-input
            v-model="forms.businessNumber"
            placeholder="请输入营业执照号"
          ></el-input>
        </el-form-item>
        <el-form-item label="话术" prop="talk">
          <el-input
            v-model="forms.talk"
            type="textarea"
            maxlength="500"
            placeholder="请输入话术，字数限制:500字"
          ></el-input>
        </el-form-item>
        <el-form-item label="报备通道（线路）" prop="channel">
          <el-input v-model="forms.channel" maxlength="500"></el-input>
        </el-form-item>
      </el-form>
      
      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >营业执照复印件（只可上传一张）(盖公章)</span>
      <!-- 第一排第一张 -->
      <div style="display: flex; justify-content: center">
        <el-upload
          style="margin: 20px"
          :file-list="fileList"
          :on-change="imgPreview"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
      </div>
      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px">
        法人身份证复印件(盖公章)
        <h5 style="margin-left: 115px">
          联通1,移动4需要添加手持身份证照片（正反面）(法人无法提供就提供经办人的手持身份证照片)
        </h5>
        <h5 style="margin-left: 115px">电信额外材料请联系客服</h5>
      </span>
      <div style="display: flex; justify-content: center">
        <!-- 第二排第一张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList1"
          :on-change="imgPreview1"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess1"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
        <!-- 第二排第二张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList4"
          :on-change="imgPreview4"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess4"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
        <!-- 第二排第三张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList6"
          :on-change="imgPreview6"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess6"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
      </div>
      <span></span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >经办人身份证复印件（盖公章）/经办人手持身份证照片</span
      >
      <div style="display: flex; justify-content: center">
        <!-- 第三排第一张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList2"
          :on-change="imgPreview2"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess2"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
        <!-- 第三排第二张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList5"
          :on-change="imgPreview5"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess5"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
        <!-- 第三排第三张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList7"
          :on-change="imgPreview7"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess7"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>

      </div>
      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >公司报备话术模板证复印件（只可上传一张）(盖公章)</span
      >
      <div style="display: flex; justify-content: center">
        <!-- 第四排第一张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList3"
          :on-change="imgPreview3"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess3"
          :on-remove="handleRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
        <!-- 第四排第二张 -->
        <el-upload
          style="margin: 20px"
          :file-list="fileList8"
          :on-change="imgPreview8"
          :headers="myHeaders"
          :action="doUpload"
          limit="1"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-success="handleSuccess8"
          :on-remove="handleRemove">
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog v-model="dialogVisible" class="pic">
          <img width="500" height="500" :src="dataUrl" alt="" />
        </el-dialog>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="editShow = false">取 消</el-button>
          <el-button type="primary" @click="editSubmit('draft')"
            >暂 存</el-button
          >
          <el-button type="primary" @click="editSubmit('add')">确 定</el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 详情弹出框 -->
    <el-dialog title="申请详情:" v-model="detailsShow" width="60%">
      <el-form
        ref="dataAddForm"
        :model="forms"
        :rules="addRules"
        label-width="130px"
        style="text-align: center;">
        <!-- <el-form-item label="代理编号" prop="userId">
          <el-input v-model="forms.userId" placeholder="请输入代理编号" disabled="false"></el-input>
        </el-form-item> -->
        <el-form-item label="企业名称" prop="companyName">
          <el-input
            v-model="forms.companyName"
            placeholder="请输入企业名称"
            disabled="false"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人姓名" prop="legalName">
          <el-input
            v-model="forms.legalName"
            placeholder="请输入法人姓名"
            disabled="false"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人身份证号" prop="legalCard">
          <el-input
            v-model="forms.legalCard"
            placeholder="请输入法人身份证号"
            disabled="false"
          ></el-input>
        </el-form-item>
        <el-form-item label="法人电话号" prop="legalPhone">
          <el-input
            v-model="forms.legalPhone"
            placeholder="请输入法人电话号"
            disabled="false"
          ></el-input>
        </el-form-item>
        <el-form-item label="营业执照代码" prop="businessNumber">
          <el-input
            v-model="forms.businessNumber"
            placeholder="请输入营业执照号"
            disabled="false"
          ></el-input>
        </el-form-item>

        <el-form-item label="话术编辑" prop="talk">
          <el-input
            v-model="forms.talk"
            type="textarea"
            maxlength="500"
            placeholder="请输入话术，字数限制:500字"
            disabled="false"
          ></el-input>
        </el-form-item>

        <el-form-item label="报备通道（线路）" prop="channel">
          <el-input
            v-model="forms.channel"
            maxlength="500"
            disabled="false"
          ></el-input>
        </el-form-item>
      </el-form>

      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >营业执照复印件(盖公章)</span
      >

      <div style="display: flex; justify-content: center">
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <!-- <img :src="dataUrl" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;"> -->
      </div>

      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px">
        法人身份证复印件(盖公章)
        <h5 style="margin-left: 115px">
          联通1,移动4需要添加手持身份证照片（正反面）(法人无法提供就提供经办人的手持身份证照片)
        </h5>
        <h5 style="margin-left: 115px">电信额外材料请联系客服</h5>
      </span>
      <div style="display: flex; justify-content: center">
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl1"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl4"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>

        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl6"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <!-- <img :src="dataUrl1" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;">
        <img :src="dataUrl4" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;"> -->
      </div>
      <span></span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >经办人身份证复印件（盖公章）/经办人手持身份证照片</span
      >
      <div style="display: flex; justify-content: center">
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl2"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl5"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>

        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl7"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <!-- <img :src="dataUrl2" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;">
        <img :src="dataUrl5" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;"> -->
      </div>

      <span style="font-weight: bold; font-size: 18px; color: red">*</span>
      <span style="margin-left: 2px; font-weight: bold; font-size: 18px"
        >公司报备话术模板证复印件（只可上传一张）(盖公章)</span
      >
      <div style="display: flex; justify-content: center">
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl3"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <el-image
          style="width: 200px; margin: 20px; height: 200px; cursor: pointer"
          :src="dataUrl8"
          :preview-src-list="srcList"
        >
          <template #error>
            <div class="el-image_error" style="text-align: center">
              暂未上传
            </div>
          </template>
        </el-image>
        <!-- <img :src="dataUrl3" alt="暂未上传" style="margin:20px;height: 200px;width: 200px;"> -->
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button
            type="danger"
            icon="el-icon-close"
            circle
            @click="noPass"
            v-if="realname == 'admin'"
            >审核驳回</el-button
          >
          <el-button
            type="success"
            icon="el-icon-check"
            circle
            @click="pass"
            v-if="realname == 'admin'"
            >审核通过</el-button
          >
          <el-button @click="detailsShow = false">退 出</el-button>
        </span>
      </template>
    </el-dialog>

    <!-- 审核驳回弹出框 -->
    <el-dialog title="驳回原因:" v-model="remarksShow" width="60%">
      <el-input
        type="textarea"
        :rows="10"
        placeholder="请输入驳回原因"
        v-model="textarea"
      >
      </el-input>

      <template #footer>
        <span class="dialog-footer">
          <el-button @click="remarksSubmit">确认提交</el-button>
          <el-button @click="remarksShow = false">退 出</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import axios from "axios";
let token = localStorage.getItem("TOKEN");
export default {
  name: "enterpriseApplication",
  data() {
    return {
      imgShow: false,
      imgUrl: "",
      myHeaders: {
        "X-Access-Token": token,
      },
      doUpload: "http://118.190.2.70:9999/vo/uuid-pass/upload",
      // doUpload:"http://hp.damaitongxin.com/uuid-pass/upload",
      dialogImageUrl: "",
      dialogVisible: false,
      tableData: [],
      fileList: [],
      fileList1: [],
      fileList2: [],
      fileList3: [],
      fileList4: [],
      fileList5: [],
      fileList6: [],
      fileList7: [],
      fileList8: [],
      companyName: "",
      form: {
        id: "",
        userId: null,
        companyName: null,
        createTime: "",
        status: null,
      },
      forms: {
        id: "",
        userId: "",
        companyName: "",
        createTime: "",
        status: "",
        legalName: "",
        legalCard: "",
        legalPhone: "",
        businessNumber: "",
        talk: "",
        channel: "",
      },
      options: [
        {
          value: "0",
          label: "未提交",
        },
        {
          value: "1",
          label: "待审核",
        },
        {
          value: "2",
          label: "未通过审核",
        },
        {
          value: "3",
          label: "已通过审核",
        },
      ],
      value: null,
      status: 1,
      pageTotal: 0, //总共有多少数据
      pageIndex: 1, //当前在第几页
      pageSize: 10, //前端规定每页显示数量
      remarks: "", //备注（只传不回显）
      page: 1, //接口请求的页数
      size: 10, //接口请求的每页的数量
      applyShow: false, //企业申请弹出框
      editShow: false, //补充资料弹出框
      detailsShow: false, //详情弹窗
      remarksShow: false, //驳回备注弹窗
      textarea: "", //驳回内容
      addRules: {
        userId: [
          { required: true, message: "代理编号为必填项", trigger: "blur" },
        ],
        companyName: [
          { required: true, message: "企业名称为必填项", trigger: "blur" },
        ],
        legalName: [
          { required: true, message: "法人姓名为必填项", trigger: "blur" },
        ],
        legalCard: [
          { required: true, message: "法人身份证号为必填项", trigger: "blur" },
        ],
        legalPhone: [
          { required: true, message: "法人电话号为必填项", trigger: "blur" },
        ],
        businessNumber: [
          { required: true, message: "营业执照号码为必填项", trigger: "blur" },
        ],
        talk: [{ required: true, message: "话术为必填项", trigger: "blur" }],
      },
      dataUrl: "",
      dataUrl1: "",
      dataUrl2: "",
      dataUrl3: "",
      dataUrl4: "",
      dataUrl5: "",
      dataUrl6: "",
      dataUrl7: "",
      dataUrl8: "",
      realname: "",
      srcList: [],
    };
  },
  created() {
    this.form.companyName = this.$route.query.companyName;

    console.log(localStorage.getItem("TOKEN"));
    // console.log(this.value);
    this.getList();
    this.realname = localStorage.getItem("realname");
  },
  //切换界面就执行方法
  activated() {
    this.value = localStorage.getItem("status") || "";
    this.getList();
  },
  watch: {
    value() {
      this.getList();
    },
    fileList() {
      if (this.fileList.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList1() {
      console.log(222222);
      if (this.fileList1.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList2() {
      console.log(333333);
      if (this.fileList2.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList3() {
      console.log(44444444);
      if (this.fileList3.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList4() {
      console.log(555555);
      if (this.fileList4.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList5() {
      console.log(66666);
      if (this.fileList2.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList6() {
      console.log(7777777);
      if (this.fileList6.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList7() {
      console.log(8888888);
      if (this.fileList7.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
    fileList8() {
      console.log(9999999);
      if (this.fileList8.length >= 1) {
        document.getElementsByClassName(
          "el-upload--picture-card"
        )[0].style.display = "none";
      }
    },
  },
  methods: {
    imgPreview(file, fileList) {
      let arr = [];
      fileList.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList = arr;
    },

    imgPreview1(file, fileList1) {
      let arr = [];
      fileList1.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList1 = arr;
    },
    imgPreview2(file, fileList2) {
      let arr = [];
      fileList2.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList2 = arr;
    },
    imgPreview3(file, fileList3) {
      let arr = [];
      fileList3.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList3 = arr;
    },
    imgPreview4(file, fileList4) {
      let arr = [];
      fileList4.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList4 = arr;
    },
    imgPreview5(file, fileList5) {
      let arr = [];
      fileList5.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList5 = arr;
    },
    imgPreview6(file, fileList6) {
      let arr = [];
      fileList6.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList6 = arr;
    },
    imgPreview7(file, fileList7) {
      let arr = [];
      fileList7.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList7 = arr;
    },
    imgPreview8(file, fileList8) {
      let arr = [];
      fileList8.forEach((item) => {
        if (item.id) {
          arr.push(item);
        } else {
          const isLt2M = item.size / 3072 / 3072 < 1;
          const isJpgOrPng =
            item.raw.type === "image/jpeg" || item.raw.type === "image/png";
          if (!isJpgOrPng) {
            this.$message.error("只能上传图片!");
            return;
          } else if (!isLt2M) {
            this.$message.error("上传单张图片大小超过3M或命名过长!");
            return;
          } else {
            arr.push(item);
          }
        }
      });
      this.fileList8 = arr;
    },


    // 分页导航
    handlePageChange(val) {
      this.page = val;
      this.getList();
    },

    handleSuccess(response) {
      this.dataUrl = response.data;
    },
    handleSuccess1(response) {
      this.dataUrl1 = response.data;
    },
    handleSuccess2(response) {
      this.dataUrl2 = response.data;
      console.log(response.data)
    },
    handleSuccess3(response) {
      this.dataUrl3 = response.data;
    },
    handleSuccess4(response) {
      this.dataUrl4 = response.data;
    },
    handleSuccess5(response) {
      this.dataUrl5 = response.data;
    },
    handleSuccess6(response) {
      this.dataUrl6 = response.data;
    },
    handleSuccess7(response) {
      this.dataUrl7 = response.data;
    },
    handleSuccess8(response) {
      this.dataUrl8 = response.data;
    },
    //删除图片
    handleRemove(file, fileList) {
      let params = {
        url:file.url,
      };
      axios
        .post("http://118.190.2.70:9999/vo/uuid-pass/del-img", params)
        // .post("http://118.190.2.70:9999/vo/uuid-pass/del-img",params)
        .then((res) => {
          console.log(res)
          if ((res.data.statusCode = "00000")) {
            this.$message.success(res.data.message);
            document.getElementsByClassName(
              "el-upload--picture-card"
              )[0].style.display = "inline-block";
              localStorage.setItem('deletUrl',file.url)
              if(this.dataUrl == file.url){
                this.dataUrl = null;
              }else if(this.dataUrl1 == file.url){
                this.dataUrl1 = null;
              }else if(this.dataUrl1 == file.url){
                this.dataUrl1 = null;
              }
              else if(this.dataUrl2 == file.url){
                this.dataUrl2 = null;
              }
              else if(this.dataUrl3 == file.url){
                this.dataUrl3 = null;
              }
              else if(this.dataUrl4 == file.url){
                this.dataUrl4 = null;
              }
              else if(this.dataUrl5 == file.url){
                this.dataUrl5 = null;
              }
              else if(this.dataUrl6 == file.url){
                this.dataUrl6 = null;
              }
              else if(this.dataUrl7 == file.url){
                this.dataUrl7 = null;
              }
              else if(this.dataUrl8 == file.url){
                this.dataUrl8 = null;
              }
          } else {
            this.$message.error(res.data.message);
          }
        })
        .catch((err) => {
          this.$message.error("！删除失败！");
        });
    },
    //预览
    handlePictureCardPreview(file) {
      console.log(file.url);
      this.dataUrl = file.url;
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },

    //重置刷新按钮
    reset() {
      this.form.userId = null;
      this.form.companyName = null;
      this.value = null;
      this.getList();
    },
    //企业申请表单
    apply() {
      this.applyShow = true;
      this.forms = [];
      this.dataUrl = null;
      this.dataUrl1 = null;
      this.dataUrl2 = null;
      this.dataUrl3 = null;
      this.dataUrl4 = null;
      this.dataUrl5 = null;
      this.dataUrl6 = null;
      this.dataUrl7 = null;
      this.dataUrl8 = null; 
    },
    //企业申请表单的提交按钮
    applySubmit(type) {
      if (type == "add") {
        this.status = 1;
      } else {
        this.status = 0;
      }
      let params = {
        companyName: this.forms.companyName, //公司名称
        legalName: this.forms.legalName, //法人姓名
        legalCard: this.forms.legalCard, //法人身份证号
        legalPhone: this.forms.legalPhone, //法人手机号
        businessNumber: this.forms.businessNumber, //营业执照号
        talk: this.forms.talk, //话术
        channel: this.forms.channel, //报备通道
        businessImg: this.dataUrl, //营业执照复印件（只可上传一张）
        legalImg: this.dataUrl1,
        legalHandImg: this.dataUrl4,
        legalHand2Img: this.dataUrl6,
        agencyImg: this.dataUrl2,
        agencyHandImg: this.dataUrl5,
        agencyHand2Img: this.dataUrl7,
        talkImg: this.dataUrl3,
        talk2Img: this.dataUrl8,
        status: this.status,
      };
      axios
        .post("http://118.190.2.70:9999/vo/uuid-pass/add", params)
        //  .post("http://118.190.2.70:9999/vo/uuid-pass/add",params)
        .then((res) => {
          if ((res.data.statusCode = "00000")) {
            this.$message.success(res.data.message);
            this.getList();
          } else {
            this.$message.error(res.data.message);
          }
        })
        .catch((err) => {
          this.$message.error(err.data.message);
        });
      this.applyShow = false;
    },
    //点击查找
    handleSearch() {
      this.getList();
    },
    //展示，搜索
    getList() {
      let params = {
        page: this.page,
        size: this.size,
        userId: this.form.userId,
        companyName: this.form.companyName,
        status: this.value,
      };
      axios
        .post("http://118.190.2.70:9999/vo/uuid-pass/list", params)
        // .post("http://118.190.2.70:9999/vo/uuid-pass/list",params)
        .then((res) => {
          // console.log(res.data)
          this.tableData = res.data.data;
          this.pageTotal = res.data.total;
        })
        .catch((err) => {
          this.$message.error(err.data.message);
        });
    },
    //点击补充资料按钮后回显
    handleClick(row) {
      console.log("执行回显操作！")
      this.fileList = [];this.fileList1 = [];this.fileList2 = [];this.fileList3 = [];this.fileList4 = [];this.fileList5 = [];this.fileList6 = [];this.fileList7 = [];this.fileList8 = [];
      this.forms.id = row.row.id;
      this.forms.userId = row.row.userId;
      let params = {
        id: this.forms.id,
        userId: this.forms.userId,
      };
      console.log("准备调接口")
      axios
      .post("http://118.190.2.70:9999/vo/uuid-pass/findOne",params)
      .then(res =>{
        console.log(res.data.data)
        this.forms.companyName =res.data.data.companyName;
        this.forms.legalName =res.data.data.legalName;
        this.forms.legalCard =res.data.data.legalCard;
        this.forms.legalPhone = res.data.data.legalPhone;
        this.forms.businessNumber = res.data.data.businessNumber;
        this.forms.talk = res.data.data.talk;
        this.forms.channel = res.data.data.channel;
        this.dataUrl = res.data.data.businessImg;
        if(res.data.data.businessImg == '' || res.data.data.businessImg == 'null'){
          this.dataUrl = null
        }
        let str = {
            url:''
          }
          if(this.fileList.length < 1){
            str.url = res.data.data.businessImg
            console.log(str)
            this.fileList.push(str)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
            console.log(123456,this.fileList.length)
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl1 = res.data.data.legalImg;//法人身份证复印件
        if(res.data.data.legalImg == '' || res.data.data.legalImg == 'null'){
          this.dataUrl1 = null
        }
        let str1 = {
            url:''
          }
          console.log(9999,this.fileList1.length)
          if(this.fileList1.length < 1){
            str1.url = res.data.data.legalImg
            this.fileList1.push(str1)
            console.log(this.fileList1)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };
        
        this.dataUrl4 = res.data.data.legalHandImg;
         if(res.data.data.legalHandImg == '' || res.data.data.legalHandImg == 'null'){
          this.dataUrl4 = null
        }
        let str4 = {
            url:''
          }
          console.log(this.fileList4)
          if(this.fileList4.length < 1){
            str4.url = res.data.data.legalHandImg
            this.fileList4.push(str4)
            console.log(this.fileList4)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl6 = res.data.data.legalHand2Img;
        if(res.data.data.legalHand2Img == '' || res.data.data.legalHand2Img == 'null'){
          this.dataUrl6 = null
        }
        let str6 = {
            url:''
          }
          if(this.fileList6.length < 1){
            str6.url = res.data.data.legalHand2Img
            this.fileList6.push(str6)
            console.log(this.fileList6)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl2 = res.data.data.agencyImg;//代理人身份证复印件
        if(res.data.data.agencyImg == '' || res.data.data.agencyImg == 'null'){
          this.dataUrl2 = null
        }
        let str2 = {
            url:''
          }
          if(this.fileList2.length < 1){
            str2.url = res.data.data.agencyImg
            this.fileList2.push(str2)
            console.log(this.fileList2)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl5 = res.data.data.agencyHandImg;
        if(res.data.data.agencyHandImg == '' || res.data.data.agencyHandImg == 'null'){
          this.dataUrl5 = null
        }
        let str5 = {
            url:''
          }
          if(this.fileList5.length < 1){
            str5.url = res.data.data.agencyHandImg
            this.fileList5.push(str5)
            console.log(this.fileList5)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl7 = res.data.data.agencyHand2Img;
        if(res.data.data.agencyHand2Img == '' || res.data.data.agencyHand2Img == 'null'){
          this.dataUrl7 = null
        }
        let str7 = {
            url:''
          }
          if(this.fileList7.length < 1){
            str7.url = res.data.data.agencyHand2Img
            this.fileList7.push(str7)
            console.log(this.fileList7)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl3 = res.data.data.talkImg;//公司报备话术模板复印件（只可上传一张
        if(res.data.data.talkImg == '' || res.data.data.talkImg == 'null'){
          this.dataUrl3 = null
        }
        let str3 = {
            url:''
          }
          if(this.fileList3.length < 1){
            str3.url = res.data.data.talkImg
            this.fileList3.push(str3)
            console.log(this.fileList3)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };

        this.dataUrl8 = res.data.data.talk2Img;
        if(res.data.data.talk2Img == '' || res.data.data.talk2Img == 'null'){
          this.dataUrl8 = null
        }
        let str8 = {
            url:''
          }
          if(this.fileList8.length < 1){
            str8.url = res.data.data.talk2Img
            this.fileList8.push(str8)
            console.log(this.fileList8)
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "none";
            })
          }else{
            this.$nextTick(()=>{
              document.getElementsByClassName(
                "el-upload--picture-card"
                )[0].style.display = "inline-block";
            })
          };
      })
         this.editShow = true;
   },
    //补充资料提交按钮
    editSubmit(type){
       if(type == "add"){
          this.status = 1
       }else {
         this.status = 0
       }

      let params = {
        id: this.forms.id, //id必传
        userId: this.forms.userId, //代理编号
        companyName: this.forms.companyName, //公司名称
        legalName: this.forms.legalName, //法人姓名
        legalCard: this.forms.legalCard, //法人身份证号
        legalPhone: this.forms.legalPhone, //法人手机号
        businessNumber: this.forms.businessNumber, //营业执照号
        talk: this.forms.talk, //话术
        channel: this.forms.channel,
        businessImg: this.dataUrl, //营业执照复印件（只可上传一张）
        legalImg: this.dataUrl1,
        legalHandImg: this.dataUrl4,
        legalHand2Img: this.dataUrl6,
        agencyImg: this.dataUrl2,
        agencyHandImg: this.dataUrl5,
        agencyHand2Img: this.dataUrl7,
        talkImg: this.dataUrl3,
        talk2Img: this.dataUrl8,
        status: this.status,
      };
      axios
        //  .post("http://118.190.2.70:9999/vo/uuid-pass/update",params)
        .post("http://118.190.2.70:9999/vo/uuid-pass/update", params)
        .then((res) => {
          if ((res.data.statusCode = "00000")) {
            this.$message.success(res.data.message);
            this.getList();
          } else {
            this.$message.error(res.data.message);
          }
        })
        .catch((err) => {
          this.$message.error(err.data.message);
        });
      this.editShow = false;
    },

    //详情按钮,只查看不修改
    details(row) {
      this.srcList = []
      this.forms.id = row.row.id;
      let params = {
        id: this.forms.id,
      };
      axios
      .post("http://118.190.2.70:9999/vo/uuid-pass/findOne",params)
      .then(res =>{
        this.forms.userId = res.data.data.userId
        this.forms.companyName =res.data.data.companyName;
        this.forms.legalName =res.data.data.legalName;
        this.forms.legalCard =res.data.data.legalCard;
        this.forms.legalPhone = res.data.data.legalPhone;
        this.forms.businessNumber = res.data.data.businessNumber;
        this.forms.talk = res.data.data.talk;
        this.forms.channel = res.data.data.channel;
        this.dataUrl = res.data.data.businessImg;
        this.dataUrl1 = res.data.data.legalImg;//法人身份证复印件
        this.dataUrl4 = res.data.data.legalHandImg;
        this.dataUrl6 = res.data.data.legalHand2Img;
        this.dataUrl2 = res.data.data.agencyImg;//代理人身份证复印件
        this.dataUrl5 = res.data.data.agencyHandImg;
        this.dataUrl7 = res.data.data.agencyHand2Img;
        this.dataUrl3 = res.data.data.talkImg;//公司报备话术模板复印件（只可上传一张)
        this.dataUrl8 = res.data.data.talk2Img;
        this.detailsShow = true;
        this.srcList.push(this.dataUrl,this.dataUrl1,this.dataUrl2,this.dataUrl3,this.dataUrl4,this.dataUrl5,this.dataUrl6,this.dataUrl7,this.dataUrl8);
      })
   },
   //审核通过按钮
   pass(row){
      this.detailsShow = false,
      this.status = 3
      let params = {
        id: this.forms.id,
        status: this.status,
        companyName: this.forms.companyName,
        talk: this.forms.talk,
        userId: this.forms.userId,
        remark: "",
      };

      this.$confirm("请确认, 是否通过?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          axios
            // .post("http://118.190.2.70:9999/vo/uuid-pass/update",params)
            .post("http://118.190.2.70:9999/vo/uuid-pass/update", params)
            .then((res) => {
              if ((res.data.statusCode = "00000")) {
                this.$message.success(res.data.message);
                this.getList();
              } else {
                this.$message.error(res.data.message);
              }
            })
            .catch((err) => {
              this.$message.error(err.data.message);
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消通过",
          });
        });
    },
    //审核驳回按钮
    noPass(row) {
      this.remarksShow = true;
    },
    //驳回详情提交按钮
    remarksSubmit() {
      this.remarksShow = false;
      this.detailsShow = false;
      this.status = 2;
      let params = {
        id: this.forms.id,
        remark: this.textarea,
        userId: this.forms.userId,
        status: this.status,
      };
      axios
        // .post("http://118.190.2.70:9999/vo/uuid-pass/update",params)
        .post("http://118.190.2.70:9999/vo/uuid-pass/update", params)
        .then((res) => {
          if ((res.data.statusCode = "00000")) {
            this.$message.success(res.data.message);
            this.getList();
          } else {
            this.$message.error(res.data.message);
          }
        })
        .catch((err) => {
          this.$message.error(err.data.message);
        });
    },
  },
};
</script>

<style scoped >
.box {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.imgViewbox {
  width: 904px;
  height: 706px;
  position: relative;
}
.imgView {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 99999;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.5);
  justify-content: center;
  align-content: center;
}
.imgView img {
  width: 904px;
  height: 706px;
  justify-content: center;
  align-content: center;
}
.close {
  position: absolute;
  right: 20px;
  top: 0;
  font-size: 20px;
  cursor: pointer;
}
.tit {
  font-weight: normal;
  font-size: 36px;
  color: #333333;
}
.search {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}
.left {
  display: flex;
  align-items: center;
  margin-right: 30px;
}
.left span {
  width: 190px;
  text-align: center;
}
.searchBtn {
  margin-left: 15px;
  align-items: center;
}
.right {
  display: flex;
  justify-content: flex-end;
}
.reset {
  width: 80px;
  height: 34px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.add {
  margin-left: 15px;
}
.container {
  margin-top: 20px;
}
/* 话术编辑框高度设置 */
/* .el-textarea__inner{
  min-height: 300px !important;
} */
.el-form-item__label {
  text-align: center;
}

div /deep/ .el-upload {
  position: relative;
  width: 148px;
  height: 148px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 28px;
}
div /deep/ .el-upload img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

div /deep/ .el-upload-list__item-name {
  display: none;
}
div /deep/ .el-upload-list__item-status-label {
  display: none !important;
}
.el-dialog span {
  margin-left: 100px;
}
.el-dialog el-upload {
  margin: 20px;
}

.viewitem {
  width: 146px;
  height: 146px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.viewitem img {
  width: 146px;
  height: 146px;
}
.modle {
  width: 146px;
  height: 146px;
  background-color: rgba(0, 0, 0, 0.5);
  transition: opacity 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}
.modle i {
  font-style: normal;
  margin-left: 20px;
  cursor: pointer;
  color: #fff;
  font-size: 14px;
}
.viewitem:hover .modle {
  opacity: 1;
}
</style>
